<template>
	<view class="unquality-check-item">
		<view class="desc">问题描述：
			<view style="word-break: break-all; flex: 1">{{inspect.remark}}</view>
			<!-- <input v-model="inspect['描述']" type="text" placeholder="请输入问题描述"> -->
		</view>
		<view class="img-content">
			<!-- <text style="margin-right: 20rpx;">现场照片:</text> -->
			<view class="image-item" v-if="imageList[0].fileData">
				<van-image @click="previewFile(0)" :src="imageList[0].fileData" width="90" height="90"></van-image>
			</view>
			<view class="image-item" v-if="imageList[1].fileData">
				<van-image @click="previewFile(1)" :src="imageList[1].fileData" width="90" height="90"></van-image>
			</view>
			<view class="image-item" v-if="imageList[2].fileData">
				<van-image @click="previewFile(2)" :src="imageList[2].fileData" width="90" height="90"></van-image>
			</view>
			<!-- <upload :boxWidth="140"></upload> -->
		</view>
	</view>
</template>

<script>
	// import upload from '@/upload.vue'
	import vanImage from '@/wxcomponents/vant/dist/image'
	export default {
		components: {
			vanImage
		},
		props:{
			
			inspect: {
				type: Object
			}
		},
		data() {
			return {
				imageItem: [],
				imageList: {}
			};
		},
		watch: {
			 inspect: {
			       handler(newVal, oldVal) {
			         this.inspect.accessory.split(',').forEach((item,index) => {
						 this.downloadFile(index,item)
					 })
			      },
			      immediate: true
			    }
		},
		methods: {
			downloadFile(index, id) {
				this.$http.post('common/file/download', {id}).then(res => {
					if(res.code === 10000) {
						this.imageItem.push(res.data.fileData)
						this.imageList[index] = {}
						this.imageList[index].fileData = res.data.fileData
						// this.imageList.push(res.data.fileData)
					}
				})
			},
			previewFile(index) {
				let previewList = []
				if (this.imageList[0]) {
					previewList.push(this.imageList[0].fileData)
				}
				if (this.imageList[1]) {
					previewList.push(this.imageList[1].fileData)
				}
				if (this.imageList[2]) {
					previewList.push(this.imageList[2].fileData)
				}
				this.$common.previewImg(previewList, index)
			}
		}
	}
</script>

<style lang="scss">
	.unquality-check-item {
		width: 674rpx;
		min-height: 258rpx;
		padding: 20rpx;
		border: 2rpx solid #B5B5B5;
		margin-bottom: 20rpx;
		.desc {
			margin-bottom: 20rpx;
			display: flex;
			input {
				width: 450rpx;
			}
		}
		.img-content {
			display: flex;
			.image-item {
				margin-right: 20rpx;
			}
		}
	}
</style>
